import { StrictMode, useEffect } from "react";
import { createRoot } from "react-dom/client";
import "./index.css";
// import App from "./App.tsx";
import "@ant-design/v5-patch-for-react-19";
import { getCssSelector } from "css-selector-generator";

createRoot(document.getElementById("root")!).render(
    <StrictMode>
        <App />
    </StrictMode>
);

function App() {
    useEffect(() => {
        const root = query(".c-theme-color");
        const firstElement = queryAll(".c-theme-color a");
        const secondElement = query(".c-theme-color a");
        const css = getCssSelector(secondElement, { root });
        console.log(css);
    }, []);
    return (
        <>
            <div className="aaa">
                <div className="bbb">1</div>
                <span className="ccc">fs</span>
            </div>
            <div className="aaa bbb">
                <span className="ccc">fs</span>
            </div>
            <span className="bbb ddd"></span>
            <div className="c-theme-color tabs-wrap_3Ac9n">
                <a href="/board?tab=homepage" className="tab-item_17MbK" data-click='{"pos":"tab_homepage"}'>
                    <span>首页</span>
                </a>
                <a href="/board?tab=realtime" className="tab-item_17MbK" data-click='{"pos":"tab_realtime"}'>
                    <span>热搜</span>
                </a>
                <a href="/board?tab=novel" className="tab-item_17MbK active" data-click='{"pos":"tab_novel"}'>
                    <span>小说</span>
                </a>
                <a href="/board?tab=movie" className="tab-item_17MbK" data-click='{"pos":"tab_movie"}'>
                    <span>电影</span>
                </a>
                <a href="/board?tab=teleplay" className="tab-item_17MbK" data-click='{"pos":"tab_teleplay"}'>
                    <span>电视剧</span>
                </a>
            </div>
        </>
    );
}

function query(selecotr: string): HTMLElement {
    return document.querySelector<HTMLElement>(selecotr)!;
}
function queryAll(selecotr: string) {
    return Array.from(document.querySelectorAll<HTMLElement>(selecotr));
}
